<template>
<div class="Cooperation">
    <el-form :model="message" ref="message" :rules="rules" :disabled="editor==='查看'" label-width="150px">
        <el-form-item label="合作社（工商名称）" class="cooperation" prop="subjectName">
            <el-input v-model="message.subjectName" minlength="3" :disabled="editor==='编辑'" maxlength="30" show-word-limit></el-input>
        </el-form-item>
        <el-form-item label="行业" prop="systemDataType">
            <el-checkbox-group v-model="systemDataType">
                <el-checkbox label="SS2">种植业</el-checkbox>
                <el-checkbox label="SS1">渔业</el-checkbox>
            </el-checkbox-group>
        </el-form-item>
        <products @on-change="getSystemName" :SystemName="subjectMainProduct">主要产品</products>
        <!-- <el-form-item label="主要产品-其他">
        <el-tag
          style="margin: 5px"
          v-for="item in items"
          :key="item"
          closable
          @close="handleClose(item)"
          >{{ item }}</el-tag
        >
        <el-input
          v-model="message.OrderSubjectMainProduct"
          @change="enter"
        ></el-input>
      </el-form-item> -->
        <el-form-item label="年产值(万元)" prop="subjectYearTotalValue">
            <el-input type="number" v-model="message.subjectYearTotalValue" minlength="1" maxlength="9" show-word-limit placeholder="（去年）"></el-input>
        </el-form-item>
        <div class="flex">
            <el-form-item label="选择镇街" prop="subjectTownId">
                <el-select v-model="message.subjectTownId" @change="changeOptions">
                    <el-option v-for="(item, index) in options" :key="index" :label="item.label" :value="item.value" @click.native="getIndex(index)"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="选择村居" prop="subjectVillageId">
                <el-select v-model="message.subjectVillageId">
                    <el-option v-for="(item, index) in options[townIndex].children" :key="index" :label="item.label" :value="item.value"></el-option>
                </el-select>
            </el-form-item>
        </div>
        <el-form-item label="地址" prop="subjectAddr">
            <el-input v-model="message.subjectAddr" minlength="3" maxlength="130" show-word-limit class="field"></el-input>
        </el-form-item>
        <el-form-item label="联系人" prop="subjectLinkman">
            <el-input v-model="message.subjectLinkman" minlength="3" maxlength="30" show-word-limit></el-input>
        </el-form-item>
        <el-form-item label="联系电话" class="right" prop="subjectTele">
            <el-input v-model="message.subjectTele" maxlength="11" show-word-limit></el-input>
        </el-form-item>

      <el-form-item label="年龄" prop="age">
            <el-input v-model="message.age" minlength="15" maxlength="18" show-word-limit></el-input>
        </el-form-item>

                <el-form-item label="学历" prop="education">
            <el-input v-model="message.education" minlength="15" maxlength="18" show-word-limit></el-input>
        </el-form-item>

                <el-form-item label="户籍" prop="resident">
            <el-input v-model="message.resident" minlength="15" maxlength="18" show-word-limit></el-input>
        </el-form-item>

        <el-form-item label="组织机构代码" class="cooperation">
            <el-input v-model="message.subjectOrgCode" maxlength="18" show-word-limit class="cooperate"></el-input>
        </el-form-item>
        <el-form-item label="统一社会信用代码" class="cooperation">
            <el-input v-model="message.subjectUscCode" maxlength="18" show-word-limit class="cooperate"></el-input>
        </el-form-item>
        <el-form-item label="员工人数" class="cooperation">
            <el-input v-model="message.subjectPersonNum" type="number" maxlength="9" show-word-limit></el-input>
        </el-form-item>
        <el-form-item label="主体简介">
            <el-input type="textarea" maxlength="500" show-word-limit v-model="message.subjectIntro" class="field"></el-input>
        </el-form-item>
        <el-form-item label="图片资料">
            <Upload style="display: block" @click="getUrlList"></Upload>
        </el-form-item>

        <el-form-item label="">
            <el-button type="primary" v-if="editor==='新增'" @click="preserve">新增</el-button>
            <el-button type="primary" v-else-if="editor==='编辑'" @click="editSave">编辑</el-button>
        </el-form-item>
    </el-form>
    <span v-show="false">{{subjectRow.id}}</span>
</div>
</template>

<script>
import {
    checkPhone,
    checkUserName
} from "@/library/regexp.js";
import {
    mapGetters
} from "vuex";
export default {
    props: {
        subjectFormRow: {
            type: Object,
            default: function () {
                return {}
            }
        },
        editor: {
            type: [Boolean, String],
        },
    },
    name: "Cooperation",
    data() {
        return {
            systemDataType: ['SS1','SS2'],
            level: 1,
            townIndex: 0,
            items: [],
            tableData: [{
                    date: "2016-05-02",
                    name: "667",
                },
                {
                    date: "2016-05-02",
                    name: "456",
                },
            ],
            rules: {
                subjectName: [{
                    required: true,
                    message: "合作社（工商名称）不能为空",
                    trigger: "blur",
                }, ],
                subjectYearTotalValue: [{
                    required: false,
                    message: "年产值不能为空",
                    trigger: "blur",
                }, ],
                subjectTownId: [{
                    required: false,
                    message: "镇街不能为空",
                    trigger: "change",
                }, ],
                subjectAddr: [{
                    required: false,
                    message: "地址不能为空",
                    trigger: "blur",
                }, ],
                // subjectLinkman: [{
                //     required: false,
                //     message: "请填写正确格式的姓名",
                //     validator: checkUserName("请填写正确格式的姓名"),
                //     trigger: "blur",
                // }, ],
                // subjectTele: [{
                //     required: true,
                //     message: "请填写正确格式的手机号",
                //     validator: checkPhone("请填写正确格式的手机号"),
                //     trigger: "blur",
                // }, ],
            },

            message: {
                subjectAddr: "", //地址
                subjectBase: "", //所属基地  必填 1
                subjectIndustry: "", //主体行业 必填 1
                systemType: "",
                subjectIntro: "", //简介
                subjectLinkman: "", //联系人 必填 1
                subjectMainProduct: [], //主要产品
                subjectName: "", //主体名称 必填 1
                subjectOrgCode: "", //组织机构代码
                subjectOtherProduct: "", //其他产品
                subjectPersonNum: "", //员工人数
                subjectPlanId: "", //计划编号 必填
                subjectTele: "", //联系人电话 必填 1
                subjectTownId: "", //所属镇 (区域编码) 必填 1
                subjectType: "P0202", //主体类型(1:个体户2:合作社3:企业) 必填 1
                subjectUscCode: "", //统一社会信用代码
                subjectVillageId: "", //所属村 (区域编码)
                subjectYearTotalValue: "", //去年产值 必填  1
                imgUrl: "", // 图片信息
            },
            subjectMainProduct: [],
            subjectMainProducts: []
        };
    },
    computed: {
        ...mapGetters({
            options: "getTreeData/filtersVillage",
        }),
        subjectRow: {
            get() {
                if (this.editor === '新增') {
                    return false
                }
                this.message = this.subjectFormRow
                this.systemDataType = [this.message.systemType]
                if (this.message.subjectMainProduct !== null) {
                    this.subjectMainProduct = this.message.subjectMainProduct.split(',')
                    this.subjectMainProducts = this.message.subjectMainProduct.split(',')
                }
                return this.subjectFormRow
            },
            set(val) {
                this.subjectFormRow = val
            }
        },
    },
    methods: {
        close() {
            this.$emit("on-close", "123");
        },
        changeOptions() {
            this.message.subjectVillageId = "";
        },
        handleClose(item) {
            this.items.splice(this.items.indexOf(item), 1);
        },
        enter(value) {
            this.items.push(value);
        },
        getSystemName(arr) {
            this.subjectMainProducts = arr
            console.log(this.subjectMainProducts);
        },
        getUrlList(value) {
            this.message.imgUrl = "";
            for (let i = 0; i < value.length; i++) {
                this.message.imgUrl += value[i];
                if (i < value.length - 1) {
                    this.message.imgUrl += ",";
                }
            }
        },
        handleClick(row) {
            console.log(row);
        },
        getIndex(val) {
            this.townIndex = val;
        },
editSave() {
            this.$refs["message"].validate((valid) => {
                if (valid) {
                    // this.message.ossImgList = this.ossList;
                    // // if (this.message.subjectType == '个体') {
                    // //     this.message.subjectType = "P0201"
                    // // } else if (this.message.subjectType == '合作社') {
                    // //     this.message.subjectType = "P0202"
                    // // } else if (this.message.subjectType == '企业') {
                    // //     this.message.subjectType = "P0203"
                    // // }
                    this.message.subjectBusiType = 0 // 预留字段，默认是int类型
                    this.message.subjectMainProduct = this.subjectMainProducts.join(',')
                    this.message.systemType = this.systemDataType.join(',')
                    delete this.message.landSubjectRs
                    this.$axios
                        .post("rbac/data/subject/put", {
                            params: this.message
                        })
                        .then((res) => {
                            if (res.result === "success") {
                                this.$message.success("编辑成功");
                                this.$emit("success", {
                                    visible: false,
                                    code: 200,
                                });
                            } else {
                                this.systemDataType = ['SS2','SS1']
                                this.$message.warning(res.errorMsg);
                            }
                        })
                        .catch((err) => {
                              this.systemDataType = ['SS2','SS1']
                            this.$message.error(err.response.data.message);
                        });
                } else {
                    this.$message.error("请检查必填项是否未填");
                    return false;
                }
            });
        },
        preserve() {
            this.$refs["message"].validate((valid) => {
                if (valid) {
                    this.message.subjectMainProduct = this.subjectMainProducts.join(',');
                    this.message.systemType = this.systemDataType.join(',');
                    this.$axios
                        .post("/rbac/data/subject/create", {
                            params: this.message,
                        })
                        .then((res) => {
                            console.log(res);
                            if (res.result === "success") {
                                this.$message.success("增加成功");
                                this.$emit("success", {
                                    visible: false,
                                    code: 200,
                                });
                            } else {
                                this.$message.error(res.errorMsg);
                            }
                        })
                        .catch((err) => {
                            this.$message.error(err.response.data.message);
                        });
                } else {
                    return false;
                }
            });
        },
    },
};
</script>
